
<template>
  <main-container headerText="团队管理 >> 团队列表">
    <div class="content" :key="showPageKey">
      <!-- <top-option>
        <div slot="left-box">
          <input-search
            lableName="手机号"
            inputValue="phone"
            :tThis="this"
            inputPlaceholder="请输入手机号"
          />

          <select-search
            lableName="级别"
            selectIdName="readeIntegral"
            :tThis="this"
            selectPlaceholder="请选择级别"
            :selectOpts="gradeOpts"
            selectWidth="150px;"
            labelWidth="80px;"
          />
        </div>
        <div slot="right-box">
          <div class="sub">
            <el-button @click="handleSearch" class="orange">查询</el-button>
          </div>
        </div>
      </top-option> -->

      <v-tree :data="asyncData" show-line :async="getData" @select="selectFn" @check="checkFn"></v-tree>
    </div>
  </main-container>
</template>

  <script>
import jhTools from "@/utils/jhTools"; //工具函数
import API from "@/utils/api_config.js"; //引入api

import main_container from "@/components/main_container";
import top_option from "@/components/subCon/topOption";
import input_search from "@/components/subCon/inputSearch";
import select_search from "@/components/subCon/selectSearch";
import date_search from "@/components/subCon/dateSearch";

export default {
  components: {
    "main-container": main_container,
    "top-option": top_option,
    "input-search": input_search,
    "select-search": select_search,
    "date-search": date_search,
  },
  props: {},
  data() {
    return {
      //列表
      tableData: [],
      multipleSelection: [],
      showPageKey: 101,
      //分页
      currentPageIdx: 1, //当前页与跳转框的初始值
      pageCount: 1, //总条数
      onePageSize: 10, //每页的条数

      formData: {
        phone: null,
        readeIntegral: null,
      },

      gradeOpts: [
        { value: "1", label: "普粉" },
        { value: "2", label: "铁粉" },
        { value: "3", label: "超粉" },
        { value: "4", label: "V1" },
        { value: "5", label: "V2" },
        { value: "6", label: "V3" },
        { value: "7", label: "V4" },
        { value: "8", label: "V5" },
        { value: "9", label: "V6" },
        { value: "10", label: "V7" },
        { value: "", label: "全部" },
      ],

      allMethods: "",

      // asyncData: [
      //     { title: 'pNode 01', children: []},
      //     { title: 'pNode 02', children: []},
      //     { title: 'pNode 03'},
      // ],
      asyncData: [],
      
    };
  },
  mounted() {
    this.getTreeData();
  },
  methods: {
    // getData(node) {
    //   console.log(node);
    //   return new Promise(resolve => {
    //     setTimeout(()=>{
    //       resolve([
    //           { title: `leaf ${node.clue}-0`, children: []},
    //           { title: `leaf ${node.clue}-1`, children: []},
    //           { title: `leaf ${node.clue}-2`},
    //       ])
    //     }, 1000)
    //   })
    // },
    selectFn(data) {
      console.log(data);
    },
    checkFn(data) {
      console.log(data);
    },

    //查询
    handleSearch() {
      this.asyncData = [];
      this.getTreeData();
    },

    getTreeData() {
      let url = API.team_m.searchTeamList;
      let data = {
        phone: this.formData.phone,
        readeIntegral: this.formData.readeIntegral,
        pageIndex: 1,
        pageSize: 100,
        userId: null,
      };
      console.log("参数", data);
      jhTools.post(
        url,
        data,
        null,
        (res) => {
          console.log("结果", res);
          if (res.code == "200") {
            if (res.data.team.length != 0) {
              for (var i = 0; i < res.data.team.length; i++) {
                let jsonP = {};
                let children = [];
                let teamNum = res.data.team[i].teamNum == null?0:res.data.team[i].teamNum;
                let teamAmount = res.data.team[i].teamAmount == null?0:res.data.team[i].teamAmount;
                jsonP.title =
                  "<div style='font-size: 16px;'>" +
                  res.data.team[i].phone +
                  "&nbsp;&nbsp;&nbsp;" +
                  res.data.team[i].grade +
                  "&nbsp;&nbsp;&nbsp;" +
                  teamNum+
                  "&nbsp;&nbsp;&nbsp;" +
                  teamAmount +
                  "</div>";

                jsonP.userId = res.data.team[i].id;
                jsonP.children = children;
                this.asyncData.push(jsonP);
              }
            }
          } else {
            this.$message({
              type: "warning",
              message: res.message,
            });
          }
        },
        (err) => {
          console.log(err);
        }
      );
    },

    getData(node) {
        // console.log(node);
        // console.log(node.userId);
        return new Promise((resolve) => {
            this.getTreeDataSon(node.userId).then((list) => {
                console.log("执行");
                console.log(list);             
                setTimeout(() => {
                    resolve(
                        list
                    );  
                }, 500);
            });
        });

    },

    getTreeDataSon(userId) {
      let url = API.team_m.searchTeamList;
      let data = {
        phone: this.formData.phone,
        readeIntegral: this.formData.readeIntegral,
        pageIndex: 1,
        pageSize: 100,
        userId: userId,
      };
      //console.log("参数", data);
      return new Promise((resolve, reject) => {
        jhTools.post(
          url,
          data,
          null,
          (res) => {
            //console.log("结果", res);
            if (res.code == "200") {
              // if (res.data.team.length != 0) {
                var list = [];
                for (var i = 0; i < res.data.team.length; i++) {
                    let jsonP = {};
                    let children = [];
                    let teamNum = res.data.team[i].teamNum == null?0:res.data.team[i].teamNum;
                    let teamAmount = res.data.team[i].teamAmount == null?0:res.data.team[i].teamAmount;
                    jsonP.title = 
                    
                  "<div style='font-size: 16px;'>" +
                    res.data.team[i].phone +
                    "&nbsp;&nbsp;&nbsp;" +
                    res.data.team[i].grade +
                    "&nbsp;&nbsp;&nbsp;" +
                    teamNum+
                    "&nbsp;&nbsp;&nbsp;" +
                    teamAmount+
                    "</div>";
                    jsonP.userId = res.data.team[i].id;
                    jsonP.children = children;
                    list.push(jsonP);
                }
                console.log("返回:"+list);
                resolve(list);
              // }
            } else {
              this.$message({
                type: "warning",
                message: res.message,
              });
            }
          },
          (err) => {
            console.log(err);
          }
        );
      });
    },
  },
};
</script>

<style lang="scss" scoped>
// @import '~styles/mixins.scss';
// @import '~styles/variables.scss';

//隐藏样式类
.hidden {
  display: none !important;
}
</style>
